<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js">
<!--<![endif]-->

<head>
    <include file="Public:head"/>
</head>

<body  style="background: #fff">
<section id="container" style="margin: 10px 10px 0px 10px; background: #fff">
    <!--sidebar left start-->
    <!--sidebar left end-->
    <!--main content start-->
        <section id="main-content" >
            <!--tiles start-->
            <div class="row">
                <div class="col-md-3 col-sm-6">
                    <div class="dashboard-tile detail tile-red">
                        <div class="content">
                            <h1 class="text-left timer" data-from="0" data-to="180" data-speed="2500"></h1>
                            <p>New Users</p>
                        </div>
                        <div class="icon"><i class="fa fa-users"></i>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div class="dashboard-tile detail tile-turquoise">
                        <div class="content">
                            <h1 class="text-left timer" data-from="0" data-to="56" data-speed="2500"></h1>
                            <p>New Comments</p>
                        </div>
                        <div class="icon"><i class="fa fa-comments"></i>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div class="dashboard-tile detail tile-blue">
                        <div class="content">
                            <h1 class="text-left timer" data-from="0" data-to="32" data-speed="2500"></h1>
                            <p>New Messages</p>
                        </div>
                        <div class="icon"><i class="fa fa fa-envelope"></i>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 col-sm-6">
                    <div class="dashboard-tile detail tile-purple">
                        <div class="content">
                            <h1 class="text-left timer" data-to="105" data-speed="2500"></h1>
                            <p>New Sales</p>
                        </div>
                        <div class="icon"><i class="fa fa-bar-chart-o"></i>
                        </div>
                    </div>
                </div>
            </div>
            <!--tiles end-->
            <!--dashboard charts and map start-->
            <div class="row">
                <div class="col-md-6">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h3 class="panel-title">Sales for 2014</h3>
                            <div class="actions pull-right">
                                <i class="fa fa-chevron-down"></i>
                                <i class="fa fa-times"></i>
                            </div>
                        </div>
                        <div class="panel-body">
                            <div id="sales-chart" style="height: 250px;"></div>
                        </div>
                    </div>
                </div>

            </div>
            <!--dashboard charts and map end-->
            <!--ToDo start-->


            <!--ToDo end-->
    </section>

    <!--main content end-->
    <!--sidebar right start-->
    <!--sidebar right end-->
</section>
<include file="Public:js"/>

<!--Page Level JS-->
<script src="__PUBLICCOMMON__/plugins/countTo/jquery.countTo.js"></script>
<script src="__PUBLICCOMMON__/plugins/weather/js/skycons.js"></script>
<!-- FlotCharts  -->
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.resize.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.canvas.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.image.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.categories.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.crosshair.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.errorbars.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.fillbetween.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.navigate.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.pie.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.selection.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.stack.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.symbol.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.threshold.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.colorhelpers.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.time.min.js"></script>
<script src="__PUBLICCOMMON__/plugins/flot/js/jquery.flot.example.js"></script>

<!-- ToDo List  -->
<script src="__PUBLICCOMMON__/plugins/todo/js/todos.js"></script>
<!--Load these page level functions-->
<script>
    $(document).ready(function() {
        app.timer();
    });
</script>

</body>

</html>
